<template>
  <div class="container-fluid mt-5">
    <div class="row">
      <h5 class="font-weight-bold">ImageWall 图墙</h5>
      <div class="card-columns" >


        <div v-for="img in imgList" :key="img.imgId">
          <el-image :src="img.imgLocation" alt="Card image"></el-image>
          <div class="overlay">
            <h2 class="card-title title">{{img.imgTitle}}</h2>
            <div class="more">
              <a href="/">
                <i class="fa fa-arrow-circle-o-right" aria-hidden="true"></i> More </a>
            </div>
          </div>
        </div>


      </div>
    </div>
  </div>
</template>

<script>
import {homeImgGet} from "@/api/home";

export default {
  name: "ImgWall",
  data() {
    return {
      imgList: []
    }
  },
  created() {
    homeImgGet().then(res =>{
      this.imgList = res.data.records
      console.log(this.imgList)
    })
  }
}
</script>

<style scoped>

</style>
